<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">
        <meta name="format-detection" content="telephone=no">
        <title>开麦</title>
        <link rel="stylesheet" href="./Public/frozenui/css/frozen.css">
        <script src="./Public/frozenui/js/lib/zeptojs/zepto.min.js"></script>
        <script src="./Public/frozenui/js/frozen.js"></script>
        <script src="./Public/wxmenu.js"></script>
        <script src="./Public/timeFormat.js"></script>
        <link rel="stylesheet" type="text/css" href="./Public/DateTime/dist/DateTimePicker.css" />
        <script src="./Public/jquery.min.js"></script>
        <script type="text/javascript" src="./Public/DateTime/dist/DateTimePicker.js"></script>
        <script src="./Public/pcSelect/jquery.cxselect.js"></script>
        <link rel="stylesheet" href="./Public/global.css">
        <style>
            label{color: #ff90b7;}
            .pics li{list-style: none; float: left; width: 88px;height: 88px;border:#e9e9e9 1px solid; margin: 5px; padding: 0px; overflow: hidden;
            text-height: 103px;}
            .pics .add{background-image: url('./Public/Kmic/picAdd.jpg'); background-repeat: no-repeat; background-position: center; background-size: 50px 50px;}
            .file input {
                /*position: absolute;*/
                font-size: 100px;
/*                right: 0;
                top: 0;*/
                opacity: 0;
                width: 103px; height: 103px;
            }
            .file:hover {
                background: #AADFFD;
                border-color: #78C3F3;
                color: #004974;
                text-decoration: none;
            }
        </style>
    </head>
    <body ontouchstart=""><header class="ui-header ui-border-b" style="background-color: white;">
            <i class="ui-icon-return" onclick="window.location.href='./?m=web&openid={$Think.get.openid}'"></i><h1>发通告</h1>
        </header>
        
        <div id="dtBox"></div>
        <section class="ui-container">
            <div class="ui-form ui-border-t">
                <form role="form" method="post" name="dosubmit" id="dosubmit">
                    <div class="ui-form-item ui-border-b" style="background-color: #f4f4f4;">
                        必填内容
                    </div>
                    <div class="ui-form-item ui-border-b">
                        <label>
                            标题
                        </label>
                        <input type="text" placeholder="如某某活动需要女主持一名" name="title">
                    </div>
                    
                    <div class="ui-form-item ui-border-b">
                        <label>活动类型</label>
                        <div class="ui-select">
                            <select name="activity_type">
                                <foreach name='dictionary' item='vo'>
                                    <option value="{$vo.item_name}">{$vo.item_name}</option>
                                </foreach>
                                
                            </select>
                        </div>
                    </div>
                    
                    <div class="ui-form-item ui-border-b" style="height:90px;">
                        <label>活动日期</label>
                        <input type="text" data-field="date" placeholder="活动开始日期" readonly name="activity_time">
                        <input type="text" placeholder="日期更多信息,如:5,6,7号早上" name="activity_time_input">
                    </div>
                    
                    <div class="ui-form-item ui-border-b element_id" style="height:130px;">
                        <label>活动地址</label>
                        <div class="ui-select">
                            <select class="province" data-value="广东省" name="province">
                                
                            </select>
                        </div>
                        <div class="ui-select">
                            <select class="city" data-value="广州市" name="city">
                            </select>
                        </div>
                        <div class="ui-select">
                            <select class="area" name="area">
                            </select>
                        </div>
                    </div>
                    
                    <div class="ui-form-item ui-form-item-textarea ui-border-b" style="height:120px;">
                        <label>
                            详细地址
                        </label>
                        <textarea placeholder="街道等详细地址" name="address" style="height:100px;" id="address"></textarea>
                    </div>
                    
                    <div class="ui-form-item ui-border-b">
                        <label>主持人性别</label>
                        <div class="ui-select">
                            <select name="sex">
                                <option selected value="-1">不限</option>
                                <option value="0">男</option>
                                <option value="1">女</option>
                            </select>
                        </div>
                    </div>
                    
                    <div class="ui-form-item ui-border-b">
                        <label>主持人数量</label>
                        <div class="ui-select">
                            <select name="number">
                                <option selected value="1">1个</option>
                                <option value="2">2个</option>
                                <option value="3">3个</option>
                                <option value="-1">3个以上</option>
                            </select>
                        </div>
                    </div>
                    
                    <div class="ui-form-item ui-border-b" style="height:90px;">
                        <label>
                            价格/天<br/><font size="1">留空为价格自报</font>
                        </label>
                        <input type="text" placeholder="填写起点价格" name="price" onkeyup="value=value.replace(/[^\d{1,}\.\d{1,}|\d{1,}]/g,'')" >
                        <input type="text" placeholder="填写最高价格" name="price_h" onkeyup="value=value.replace(/[^\d{1,}\.\d{1,}|\d{1,}]/g,'')" >

                    </div>
                    
                    <div class="ui-form-item ui-border-b" style="background-color: #f4f4f4;">
                        选填内容
                    </div>
                    
                    <div class="ui-form-item ui-form-item-textarea ui-border-b" style="height:120px;">
                        <label>
                            详细内容
                        </label>
                        <textarea placeholder="输入活动的详细信息" name="original_desc" style="height:100px;"></textarea>
                    </div>
                    
                    <div class="ui-form-item ui-border-b">
                        <label>
                            电话
                        </label>
                        <input type="text" placeholder="请输入电话" name="phone">
                    </div>
                    
                    <div class="ui-form-item ui-border-b">
                        <label>
                            QQ
                        </label>
                        <input type="text" placeholder="请输入QQ" name="qq">
                    </div>
                    
                    <div class="ui-form-item ui-border-b">
                        <label>
                            微信号
                        </label>
                        <input type="text" placeholder="请输入微信号" name="echat">
                    </div>
                    
                    <div class="ui-form-item ui-border-b">
                        <label>
                            Email
                        </label>
                        <input type="text" placeholder="请输入Email" name="email">
                    </div>
                    
                    
                    
                    
                    <div class="ui-form-item ui-border-b file">
                        <div style="color: #ff90b7;">添加宣传图片</div>
                        <ul class="pics">
                            
                            <li class="add">
                                <input id="file" type="file" accept="image/*" />
                                
                            </li>
                            
                            
                        </ul>
                        <div id="clear"></div>
                        <input type="hidden" name="pics" value="" />
                    </div>
                </form><div style="height:0; clear: both;"></div>
                <div class="ui-btn-wrap" style="">
                    您有{$centerUserData.point}积分。发布一条通告送3积分。
<!--                    <a href="?m=center&c=profile&openid={$Think.get.openid}&show=qrcode">点击这里获得更多积分。</a>-->
                </div>
                <div class="ui-btn-wrap" style="">
                        <button class="ui-btn-lg submit" style="background:#ff629a;color: white;" >
                            立刻发布|送3积分
                        </button>
                    </div>
            </div>
            
        </section>
        <div class="ui-loading-block show">
            <div class="ui-loading-cnt">
                <i class="ui-loading-bright"></i>
                <p>正在加载中...</p>
            </div>
        </div>
        <script src="./Public/localResizeIMG/dist/lrz.bundle.js"></script>
        <script>
            $('.show').fadeOut();
            var picArr = new Array();
            document.querySelector('#file').addEventListener('change', function () {
                $('.show').fadeIn();
            lrz(this.files[0],{width: 700})
                   .then(function (rst) {
                       // 处理成功会执行
//                       console.log(rst);
                        var xhr = new XMLHttpRequest();
                        var data = {
                            base64: rst.base64,
                            size: rst.base64.length // 校验用，防止未完整接收
                        };
                        xhr.open('POST', '?m=web&a=announcement&upload');
                        xhr.setRequestHeader('Content-Type', 'application/json; charset=utf-8');
                        xhr.onreadystatechange = function () {
//                            console.log(xhr.status);
                            if (xhr.readyState === 4 && xhr.status === 200) {
                                
                                var result = JSON.parse(xhr.response);
                                if (result.error == 0) {
                                    $(".pics").prepend('<li><img src="'+result.url+'" width="103"/></li>');
                                    picArr.push('"'+result.url+'"');
                                    console.log(picArr);
                                }
//                                console.log(result);
                                
//                                result.error
//                                    ? alert('服务端错误，未能保存图片')
//                                    //: demo_report('服务端实存的图片', result.src, result.size);
//                                                                : alert('上传OK');
                            }
                        };
                        xhr.send(JSON.stringify(data)); // 发送base64
//                        });
                   })
                   .catch(function (err) {
                       // 处理失败会执行
                       console.log(rst);
                   })
                   .always(function () {
                       // 不管是成功失败，都会执行
                       $('.show').fadeOut();
                   });
           });
           
            $("#dtBox").DateTimePicker({
               dateFormat: "yyyy-MM-dd",
               fullMonthNames:["1月", "2月", "3月", "4月", "5月", "6月", "7月", "8月", "9月", "10月", "11月", "12月"],
               shortMonthNames:["1月", "2月", "3月", "4月", "5月", "6月", "7月", "8月", "9月", "10月", "11月", "12月"],
               setButtonContent:"确定",
               clearButtonContent:"取消",
               shortDayNames:["星期天", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六"],
               titleContentDate:"时间设定"
            });
            
            $('.element_id').cxSelect({ 
                url: './Public/pcSelect/cityData.min.js',               // 如果服务器不支持 .json 类型文件，请将文件改为 .js 文件 
                selects: ['province', 'city', 'area'],  // 数组格式，请注意顺序 
                nodata: 'none' 
            }); 
            
            //
            $(".submit").click(function(){
                if ($("input[name='title']").val()=='') {
                    alert('标题不能为空');
                    return;
                }
                if ($("input[name='activity_type']").val()=='') {
                    alert('活动类型不能为空');
                    return;
                }
                if ($("input[name='province']").val()=='') {
                    alert('省不能为空');
                    return;
                }
                if ($("input[name='city']").val()=='') {
                    alert('市不能为空');
                    return;
                }
                if ($("input[name='activity_time']").val()==''&& $("input[name='activity_time_input']").val()=='' ) {
                    alert('活动日期不能为空');
                    return;
                }
//                var address = $("#address").val();
//                if (address == '' ) {
//                    alert('活动地址不能为空');
//                    return;
//                }
                if ($("input[name='sex']").val()=='') {
                    alert('主持人性别不能为空');
                    return;
                }
                if ($("input[name='number']").val()=='') {
                    alert('主持人数量不能为空');
                    return;
                }
                if ($("input[name='phone']").val()==''&&$("input[name='qq']").val()==''&&
                        $("input[name='echat']").val()==''&&$("input[name='email']").val()=='') {
                    alert('至少填写一种联系方式');
                    return;
                }
                $("input[name='pics']").val(picArr.join("-"));
                $.ajax({
                    cache: true,
                    type: "POST",
                    url:"?m=web&a=announcement&action=addann&openid={$Think.get.openid}",
                    data:$('#dosubmit').serialize(),// 序列号formid
                    async: false,
                    dataType: 'json',
                    error: function(request) {
                        alert('提交超时，请稍候再试！');
                        $('.show').fadeOut();
                    },
                    success: function(data) {
                        if (data.error == 0) {
                            alert('发布成功！信息大约在5分钟左右显示出来!');
                            window.location.href="?m=web&a=announcement&openid={$Think.get.openid}";
                        }else if (data.error == 2) {
                            alert('积分不够,请24小时后再试!');
                        }else if (data.error == 3) {
                            alert('您的用户数据出错,请取消关注后重试.或者与管理员联系.');
                        }else{
                            alert('提交超时，请稍候再试！');
                        }
                        $('.show').fadeOut();
                    },
                    beforeSend: function(){
                        $('.show').fadeIn();
                    },
                });
            });
        </script>
        <script src="./Public/ga.js"></script>
    </body>
</html>